<template>
  <div>
    <div id="divs">
      <p style="font-size: 20px"><b>我的委托(历史)</b></p>
    </div>
    <hr>
    <div id="divv">
      <el-form :inline="true" :model="formInline" class="demo-form-inline">
        <el-form-item>
          <el-input v-model="formInline.stockName" placeholder="股票名称" clearable></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="list">查询/返回ALL</el-button>
          <el-button type="warning" @click="todaylist">当日委托</el-button>
          <el-button type="success" @click="successlist">已完成委托</el-button>
          <el-button type="danger" @click="dangerlist">未完成委托</el-button>
        </el-form-item>
      </el-form>
    </div>
    <br>
    <template>
      <el-table
          :data="tableData"
          style="width: 65%;border: #b0b0b0 1px solid">
        <el-table-column
            prop="stockCode"
            label="股票编码"
            width="100">
        </el-table-column>
        <el-table-column
            prop="stockName"
            label="股票名称"
            width="100">
        </el-table-column>
        <el-table-column
            prop="volumeCode"
            label="本股编号"
            width="170">
        </el-table-column>
        <el-table-column
            prop="num"
            label="卖出数量"
            width="100">
        </el-table-column>
        <el-table-column
            prop="averagePrice"
            label="卖出单价"
            width="100">
        </el-table-column>
        <el-table-column
            prop="sellPrice"
            label="买出总价"
            width="100">
        </el-table-column>
        <el-table-column
            prop="createDate"
            label="卖出时间"
            width="160">
        </el-table-column>
        <el-table-column
            prop="issell"
            label="状态"
            width="100">
          <template slot-scope="scope">
            <el-tag v-if="scope.row.issell==2" type="success">已卖出</el-tag>
            <el-tag v-else-if="scope.row.issell==1" type="info">已撤销</el-tag>
            <el-tag v-else-if="scope.row.issell==3" type="warning">新消息</el-tag>
            <el-tag v-else type="danger">未卖出</el-tag>
          </template>
        </el-table-column>
        <el-table-column
            fixed="right"
            label="操作"
            width="100">
          <template slot-scope="scope">
            <el-button
                v-if="scope.row.issell==0"
                size="mini"
                type="info"
                @click="delsell(scope.row)">撤销</el-button>
            <el-button
                v-if="scope.row.issell==3"
                size="mini"
                type="warning"
                @click="show(scope.row)">查看</el-button>
          </template>
       </el-table-column>
      </el-table>

      <el-dialog title="意 愿 购 买 人" :visible.sync="dialogTableVisible">
        <el-table :data="gridData">
          <el-table-column property="buyerName" label="购买人" width="130"></el-table-column>
          <el-table-column property="buyNum" label="购买数量" width="120"></el-table-column>
          <el-table-column property="averagePrice" label="单价" width="150"></el-table-column>
          <el-table-column property="sellPrice" label="总价" width="150"></el-table-column>
          <el-table-column property="createDate" label="购买时间" width="200"></el-table-column>
          <el-table-column
              fixed="right"
              label="操作"
              width="90">
            <template slot-scope="scope">
              <el-button
                  size="mini"
                  type="primary"
                  @click="successForHe(scope.row)">与他成交</el-button>
            </template>
          </el-table-column>
        </el-table>
      </el-dialog>
    </template>
  </div>

</template>

<script>
export default {
  name: "SellView",
  data() {
    return {
      tableData:[],
      formInline:{},
      dialogTableVisible:false,
      gridData:[],
      code:''
    }
  }, methods: {
    list(){
      let token = sessionStorage.getItem("token");
      this.formInline.issell=null;
      this.formInline.newDate=null;
      this.axios.post("/stockservice/sell/sellList?token="+token,this.formInline).then(res=>{
        this.tableData=res.data.data;
      })
    },
    delsell(row){
      this.axios.post("/stockservice/sell/delSell?id="+row.id).then(res=>{
        if(res.data.code==200){
          this.$message({
            message: '撤销成功',
            type: 'success',
          });
          this.list();
        }else{
          this.$message({
            message: '撤销失败',
            type: 'error'
          });
        }
      })
    },
    successlist(){
      let token = sessionStorage.getItem("token");
      this.formInline.issell=2;
      this.formInline.newDate=null;
      this.axios.post("/stockservice/sell/sellList?token="+token,this.formInline).then(res=>{
        this.tableData=res.data.data;
      })
    },
    dangerlist(){
      let token = sessionStorage.getItem("token");
      this.formInline.issell=0;
      this.formInline.newDate=null;
      this.axios.post("/stockservice/sell/sellList?token="+token,this.formInline).then(res=>{
        this.tableData=res.data.data;
      })
    },
    todaylist(){
      let token = sessionStorage.getItem("token");
      this.formInline.newDate=115;
      this.formInline.issell=null;
      this.axios.post("/stockservice/sell/sellList?token="+token,this.formInline).then(res=>{
        this.tableData=res.data.data;
      })
    },
    show(row){
      this.dialogTableVisible=true;
      this.code=row.volumeCode;
      this.getThreeList();
    },
    getThreeList(){
      this.axios.get("/stockservice/sell/getThreeList?code="+this.code).then(res=>{
        this.gridData=res.data.data;
      })
    },
    successForHe(row){
      this.axios.post("/stockservice/sell/successForHe",row).then(res=> {
        if (res.data.code == 200) {
          this.$message({
            message: '成交成功',
            type: 'success',
          });
          this.dialogTableVisible=false;
          this.list();
        } else {
          this.$message({
            message: '成交失败',
            type: 'error'
          });
        }
      })
    }
  }, created() {
    this.list();
  }
}
</script>

<style>
#divs {
  position: relative;
  display: flex;
  justify-content: center;
  top: 1px;
  left: 1px;
  height: 50px;
  width: 160px;
}
#divv {
  position: relative;
  display: flex;
  justify-content: center;
  top: 1px;
  left: 1px;
  height: 50px;
  width: 750px;
}

</style>
